doctype html
html
    head
        meta(http-equiv='Content-Type', content='text/html; charset=utf-8')
        meta(name='viewport', content='initial-scale=1.0, user-scalable=no')
        style(type='text/css').
            body, html, #allmap {
                width: 100%;
                height: 100%;
                overflow: hidden;
                margin: 0;
            }
            #suggestId {
                position: absolute;
                z-index: 9999;
                right: 20px;
                top: 20px;
                line-height: 32px;
                padding: 0 10px;
                width: 300px;
                border: 1px solid #e4e6e7;
            }
            #suggestId:focus {
                outline: none;
            }
        script(type='text/javascript', src='//api.map.baidu.com/api?v=2.0&ak=KxkuAcGBup6sD1XxaDW85KBG')
        title 点击地图获取当前经纬度
    body
        input#lng_input(type='hidden', value='{$lng}')
        input#lat_input(type='hidden', value='{$lat}')
        input#address_input(type='hidden')
        input#city_input(type='hidden')
        input#province_input(type='hidden')
        input#district_input(type='hidden')
        input#suggestId(type='text', placeholder='请输入地址')
        #allmap
        script.
            // 百度地图API功能
            var center = new BMap.Point({$lng}, {$lat});
            var map = new BMap.Map("allmap");
            map.centerAndZoom(new BMap.Point(116.404, 39.915), 8);
            map.enableScrollWheelZoom();    //启用滚轮放大缩小，默认禁用
            map.enableContinuousZoom();
            var map_ac = new BMap.Autocomplete(    //建立一个自动完成的对象
                {
                    "input": "suggestId",
                    "location": map
                });
            var marker = new BMap.Marker(center);  // 创建标注
            map.addOverlay(marker);              // 将标注添加到地图中
            marker.enableDragging();    //可拖拽
            //marker.setAnimation(BMAP_ANIMATION_BOUNCE);
            map_ac.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
                var _value = e.item.value;
                function myFun() {
                    var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
                    map.centerAndZoom(pp, 8);
                    marker.setPosition(pp);
                    mgetLocation(pp);
                }
                myValue   = _value.province + _value.city + _value.district + _value.street + _value.business;
                var local = new BMap.LocalSearch(map, { //智能搜索
                    onSearchComplete: myFun
                });
                local.search(myValue);
            });
            var opts       = {
                width: 200,     // 信息窗口宽度
                height: 30,     // 信息窗口高度
                title: "", // 信息窗口标题
                enableMessage: false,//设置允许信息窗发送短息
            };
            var infoWindow = new BMap.InfoWindow("拖动我设置你的位置", opts);  // 创建信息窗口对象
            marker.openInfoWindow(infoWindow);
            var gc = new BMap.Geocoder();
            function msetpoint(e) {
                document.getElementById("lng_input").value = e.point.lng;
                document.getElementById("lat_input").value = e.point.lat;
                marker.setPosition(new BMap.Point(e.point.lng, e.point.lat));
                mgetLocation(e.point);
            }
            function mgetLocation(point) {
                document.getElementById("lng_input").value = point.lng;
                document.getElementById("lat_input").value = point.lat;
                gc.getLocation(point, function (rs) {
                    var addComp = rs.addressComponents;
                    marker.openInfoWindow(new BMap.InfoWindow(rs.address, opts));
                    document.getElementById("address_input").value  = rs.address;
                    document.getElementById("city_input").value     = addComp.city;
                    document.getElementById("province_input").value = addComp.province;
                    document.getElementById("district_input").value = addComp.district;
                    //alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);
                });
            }
            marker.addEventListener("dragend", msetpoint);
            map.addEventListener("click", msetpoint);
            function tilesloaded() {
                map.setCenter(center);   //设置地图中心点。center除了可以为坐标点以外，还支持城市名
                mgetLocation(center);
                // map.setZoom(8);  //将视图切换到指定的缩放等级，中心点坐标不变
                map.removeEventListener("tilesloaded", tilesloaded);
            }
            map.addEventListener("tilesloaded", tilesloaded);
            function confirm() {
                var data      = {};
                data.lng      = document.getElementById("lng_input").value;
                data.lat      = document.getElementById("lat_input").value;
                data.address  = document.getElementById("address_input").value;
                data.city     = document.getElementById("city_input").value;
                data.province = document.getElementById("province_input").value;
                data.district = document.getElementById("district_input").value;
                return data;
            }
